import { useLocale } from "@/locales"

import { DeleteRgba, DisableRgba, LockingRgba, NormalRgba } from "./styled"

const LockStatus = ({ proxyAccountInfo }: { proxyAccountInfo: any }) => {
	const { newFormat } = useLocale()
	return (
		<div>
			{!!proxyAccountInfo.paymentLockStatus && (
				<DeleteRgba>
					{newFormat("agent.charge_lock")}
					<br />
				</DeleteRgba>
			)}
			<span style={{ display: "none" }}>{newFormat("agent.login_lock")}：</span>
			{!!proxyAccountInfo.loginLockStatus && <DisableRgba>{newFormat("agent.login_lock")}</DisableRgba>}
			{!!proxyAccountInfo.gameLockStatus && <LockingRgba>{newFormat("agent.game_lock")}</LockingRgba>}
			{proxyAccountInfo.loginLockStatus === 0 && proxyAccountInfo.paymentLockStatus === 0 && (
				<NormalRgba>{newFormat("agent.normal")}</NormalRgba>
			)}
		</div>
	)
}

export default LockStatus
